<template>
    <div>
        <el-form ref="loginForm"  label-width="80px" class="login-box">
            <h3><center>新用户注册</center></h3>

            <el-form-item label="电话号码" prop="id">
                <el-input  type="text" placeholder="请输入电话" />
            </el-form-item>
            <el-form-item label="密码" prop="password">
                <el-input type="password" placeholder="请输入密码"/>
            </el-form-item>
            <el-form-item label="确认密码" prop="password">
                <el-input type="password" placeholder="请再次输入密码"/>
            </el-form-item>

            <el-form style="width: 300px;">
                <el-form-item style="height: 40px;margin-bottom: 20px;">
                    <el-input class="input" maxlength="8" placeholder="请输入验证码"></el-input>
                    <div class="divIdentifyingCode" @click="getIdentifyingCode(true)">
                        <img id="imgIdentifyingCode" style="height:40px; width: 100px; cursor: pointer;" alt="点击更换"
                             title="点击更换" />
                    </div>
                </el-form-item>
            </el-form>
            <el-form-item>
                <el-button type="primary" style="margin-left: 35px" >注册</el-button>
            </el-form-item>

        </el-form>
    </div>
</template>

<script>
    export default {
        name: "Register",
        data(){
            return
        },
        methods: {
            /**
             * 窗口代码
             * @param {Boolean} bRefresh 是否刷新
             */
            getIdentifyingCode: function (bRefresh) {
                let identifyCodeSrc = "https://www.xxx.xxx.xxx/imgCode";
                if (bRefresh) {
                    identifyCodeSrc = "https://www.xxx.xxx.xxx/imgCode?" + Math.random();
                }
                let objs = document.getElementById("imgIdentifyingCode");
                objs.src = identifyCodeSrc;
            },
        }
    }
</script>

<style scoped>
    .login-box{
        border: 1px solid #DCDFE6;
        width: 300px;
        margin: 0px auto;
        padding: 35px 35px 15px 35px;


    }
    .divIdentifyingCode {
        position: absolute;
        top: 0;
        right: 0;
        z-index: 5;
        width: 102px; /*设置图片显示的宽*/
        height: 40px; /*图片显示的高*/
        background: #e2e2e2;
        margin: 0;
    }
</style>